@use '@scss/common' as *;

.privacyWrap {
  padding-block: var(--header-height);
  & a {
    text-decoration: none;
    color: var(--color-purple-600);
    border-bottom: 1px dotted currentColor;
    transition: all 0.2s ease;

    &:visited {
      color: var(--color-purple-600);
    }

    &:hover {
      opacity: 0.8;
    }
  }
}

.radioGroup {
  margin-bottom: 1rem;
}

.tableWrap {
  width: 100%;
  overflow: auto;

  :global {
    table {
      margin-bottom: 1rem;
      overflow: auto;
      max-width: 100%;
      width: 100%;
      border-spacing: 0px;
      border-collapse: collapse;

      thead {
        color: var(--theme-elevation-500);

        th {
          font-weight: normal;
          text-align: left;
        }
      }

      th,
      td {
        padding: 0.75rem;
        min-width: 150px;
        vertical-align: top;
      }

      tbody {
        tr {
          &:nth-child(odd) {
            background: var(--theme-elevation-50);
          }
        }
      }

      @include mid-break {
        th,
        td {
          max-width: 70vw;
          padding: 0.5rem;
        }
      }

      @include small-break {
        min-width: 700px;
        overflow: scroll;
      }
    }
  }

  @include mid-break {
    margin-left: calc(var(--gutter-h) * -1);
    margin-right: calc(var(--gutter-h) * -1);
    padding-left: calc(var(--gutter-h) * 0.5);
    padding-right: calc(var(--gutter-h) * 0.5);
    width: calc(100% + (var(--gutter-h) * 2));
    max-width: calc(100% + (var(--gutter-h) * 2));
  }
}
